The IT industry is constantly evolving and it's more or less a requirement today for web developers to be familiar with and to be able to develop for all platforms. A technique that has taken hold and is now widely used is responsive design. Developing responsive design means adapting the layout to the viewing environment; the screen size. Another useful method when developing for different devices is the mobile first theory, which means developing for the mobile screen first. This is done to scale down the site and to clear unnecessary information in order to provide a better user experience.

Web pages are visited through a variety of different devices with varying screensizes. One method for adapting web pages to this variety is called responsive design. Geographical information, often in the form of embedded maps, is common on the web. The combination of responsive design and geographical information has been shown to lead to interaction problems and is therefore assumed to need special considerations. This thesis examines this combination and investegates how presentation of geographical information can be adapted to Responsive web design.

This report describes the process of developing a user-friendly and responsive archive website. The website is a Hi-fi prototype and was created for the company JG Communications, to serve as an archive for their customers? style guidelines. To create this website I have used HTML5 and CSS3 to make it responsive for various computer screens. I have also used PHP and some JavaScript to make some of the functions and Adobe Photoshop and Illustrator to make design elements for the prototype.

In my study, I have chosen to examine how the user interface and content must conform to design guidelines for responsive design makes it suitable for diverse desktop environment and for varied mobile platforms. The purpose of this study is to examine the extent recommended design guidelines based on scientific research has a positive impact on user performance and perception when using this study delivered hi-fi prototype. The goal of this study is to provide a Hi-Fi prototype with high usability that will introduce and inform the public about BrasilCine according specifications. Study findings from user testing and supplementary questionnaires show that the implemented technologies as design guidelines for responsive design and design features have a positive impact on user performance and perception. The study results are therefore relevant for further prototype development..

The use of mobile devices has increased dramatically in recent years and the development of newtechnologies has made it difficult for developers to know what screen size and device the visitor isusing. This has resulted in the fact that today there is a problem with the interface for web pages onmobile devices. They are not adapted to the flexibility required for the interfaces to be recognizedon various mobile devices. Instead of developing two separate web pages, where one is designed formobile devices and one for desktop and keep them both continously updated, responsive webdesign simplifies the work process. Responsive web design is a flexible and dynamic interface thatadapts to mobile device and screen sizes.

The IT industry is constantly evolving and requires everyone working with website development to be updated on the latest methods. The web grows larger every day, and more visits are carried out by mobile devices. It is more important than ever for companies to have updated and functional pages that can be used on different platforms. We want to find out how common it is for IT departments and web agencies to embrace the newest technology and also what it takes to get them to move from one technology to another. Responsive web design is a constantly growing new technique that helps web developers developing for different platforms.

Responsive web design (RWD) har på kort tid gått från ett koncept till en av de största trenderna inomwebbutveckling. Det är nästan underförstått idag att nya webbsidor ska vara i RWD. Trots det är inte RWD detsjälvklara alternativet som löser alla problem dagens utvecklare står inför när det gäller den stora floran av surfandeenheter.I examensarbetet djupdyker vi i tekniken, både praktiskt och teoretiskt, för att kunna dra slutsatser om RWDs styrkoroch svagheter. Detta åstadkoms genom att ta fram en applikationsplattform och en första applikation(semesterplanering) åt konsultföretaget Sigma AB, där ett av grundkraven var att det vi utvecklade skulle kunnaanvändas varsomhelst.Utifrån våra resultat lämnas rekommendationer på när RWD är alternativet att satsa på och när det behöverkompletteras av andra tekniker, så som Native- eller HTML5 applikationer..

The thesis analyzes two different approaches towards Responsive web design, Mobile-first and Desktop-first. Responsive web design is a concept for websites whose design is customised based on the screen size. The analysis is performed by collecting views on the methods and also analyzing the usage of mobile and desktop internet to create a prototype of a responsive website where both methods are beeing used.The main difference between the methods is the foundation, where one is designed for mobile and the other for desktop. The thesis indicates that Mobilef-irst gives a better result for the mobile, which unlike the computer has poor performance, smaller screen and poor internet connection, therefore an advantage for the device that needs more focus to maintain a fast response. Desktop-first does not take this opportunity, but focus instead on the computer where the performance is better, which leads to a unnoticeable difference in response time.

Advertising in responsive websites is a quite new phenomenon and has therefore, previously not been a target for any mayor research. Todays society, where new technological innovations persistantly supersede others must be seen as a possible changer for how companies advertise to this society. This paper sheds light on many of the difficulties connected with advertising for responsive websites, but also possibilities and advices for the future. Through a litterature review and a focus group with respondents from a large communication agency in Umea?, insights, implications, solutions and thoughts both connected to specific websites but also around advertising for the future as a whole is presented.

The main topic of this thesis is to evaluate the impact on the usability of web pages when using Responsive web design, a concept for developing web pages whose design adapts to the screen size being used. This is done by creating a responsive prototype based on an existing web site. A number of usability tests are conducted on the two versions of the site in order to compare the time to complete the tests and to observe the behaviour of the test participants. The tests are conducted on desktop as well as on mobile devices with varying screen size.The number of test participants was relatively low, and so the quantitative result is not statistically valid. However, the conclusion is that the most effective combination is to use either of the sites on desktop format.

Denna uppsats beskriver utvecklingen inom projektet att skapa en redesign av en intranätmall till företaget Circuit i Stockholm. Denna intranätmall representerar de intranät som företaget producerar och används för att sälja in intranät till nya kunder. På grund av att många uppdateringar och nya funktioner tillkommit i de senaste intranäten som levererats vill företaget uppdatera sin intranätmall och som en del i arbetet skapa en ny design till den. Det som levererades inom projektet var slutgiltiga Photoshopskisser med syftet att beskriva designen i detalj, samt påbörjad kodmässig implementering i front-end med hjälp av ramverk för responsiv design..

Användandet av enheter med varierande skärmstorlek för att surfa på webbsidor ökar. Webben är således under en ständig förändring. Ansvariga för en webbsida måste därmed bestämma hur de ökade kraven som dessa olika enheter ställer ska kunna tillgodoses. Genom att använda sig av HTML5, CSS3 samt Responsive web design kan en webbsidas design på ett önskvärt sätt anpassas efter enhetens skärmstorlek. Denna uppsats syftar till att ge riktlinjer för att förenkla den migrationsprocess som en designer av en webbsida förr eller senare måste ta ställning till för att kunna hantera olika enheters skärmstorlekar.

I och med lanseringen av nya och mobila plattformar, såsom smarttelefoner och surfplattor, uppstår svårigheter med att anpassa webbsidor för samtliga typer av enheter. Tidigare har mobila applikationer (appar) och mobila sidor använts för att överkomma dessa problem. Responsive web design (RWD) är en ung designprincip som uppkom 2010 och har anammats av många webbutvecklare. Designprincipen medför att en webbsidas presentation förändras beroende på skärmstorleken som används för att visa sidan. I en studie har fem företag intervjuats för att få deras tankar och åsikter om RWD i jämförelse med utveckling av mobila sidor och appar.

The main topic of this thesis is to evaluate the impact on the usability of web pages when using Responsive web design, a concept for developing web pages whose design adapts to the screen size being used. This is done by creating a responsive prototype based on an existing web site. A number of usability tests are conducted on the two versions of the site in order to compare the time to complete the tests and to observe the behaviour of the test participants. The tests are conducted on desktop as well as on mobile devices with varying screen size.The number of test participants was relatively low, and so the quantitative result is not statistically valid. However, the conclusion is that the most effective combination is to use either of the sites on desktop format.

Idag besöker vi inte längre webbplatser enbart via datorer, utan även mobiltelefoner och surfplattor. För att göra interaktionen på en webbplats användbar via flera olika plattformar blir det allt vanligare med responsiv anpassning. Denna utveckling ställer högre krav på den grafiska formgivaren som bör ha god kunskap om de plattformar som designen tillämpas på för att nå högsta möjliga användbarhet. En grafisk formgivare ska alltså förstå vad användbarhet innebär och hur denna kunskap ska tillämpas i designen. Kandidatarbetet undersöker vad som definierar användbarhet och vad grafisk design bidrar till i skapandet av responsiva webbplatser.